<!doctype html>
<html>
<head>
<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title>信息录用</title>
<link rel="stylesheet" href="${webroot}/static/plugins/user/css/index_style.css" />
<script src="${webroot}/static/plugins/user/js/jquery-1.7.1.min.js"></script>
<link rel="stylesheet" href="${webroot}/static/plugins/user/plugins/eleme-ui/index.css" />
<script type="text/javascript" src="${webroot}/static/plugins/layui/layui.js"></script>
<link rel="stylesheet" href="${webroot}/static/plugins/layui/css/layui.css">
<script type="text/javascript" src="https://cdn.bootcss.com/distpicker/2.0.5/distpicker.min.js"></script>
	<style>


	</style>
</head>
<script>

    var phoneWidth = parseInt(window.screen.width);
    var phoneHeight = parseInt(window.screen.height);
    var phoneScale = phoneWidth/590;//除以的值按手机的物理分辨率
    var phonheight = phoneHeight/200;
    var ua = navigator.userAgent;
    if (/Android (\d+\.\d+)/.test(ua)) {


        var version = parseFloat(RegExp.$1);
        // andriod 2.3
        if (version > 2.3) {
            document.write('<meta name="viewport" content="width=device-width,initial-scale='+phoneScale+',minimum-scale='+phoneScale+',maximum-scale='+phoneScale+',user-scalable=no">');

            // andriod 2.3以上
        } else {
            document.write('<meta name="viewport" content="width=device-width,user-scalable=no">');

        }
        // 其他系统
    } else {
        document.write('<meta name="viewport" content="width=device-width, initial-scale='+phoneScale+',minimum-scale='+phoneScale+',maximum-scale ='+phoneScale +',user-scalable=no,">');

    }


</script>
<body>
		<div class="register" id="fontset1">

			<table cellspacing="0" cellpadding="0"  id="fontset2"  style="margin-top: 30px" >
				<tr>
					<td style=" margin-left:20px;width:220px ; text-align: center; color: #38bca4; font-size: 20px; font-weight: bold; "colspan="2" ><br>长沙市金融办</br>非法经营案个人资金返回查询系统</td>
				</tr>
				<tr>
					<td width="120px; "><h3>基本信息</h3></td>
				</tr>
				<tr>
					<td><input type="text"  name="user_id" placeholder="请输入用户ID"  hidden="hidden"/></td>
				</tr>
				<tr>
					<td>姓名：</td>
					<td><input type="text"  name="user_name" required="" lay-verType="tips" lay-verify="required" placeholder="请输入用户名称" autocomplete="off" class="layui-input" readonly="readonly"/></td>
				</tr>
				<tr>
					<td>身份证号码：</td>
					<td><input type="text" name="id_card" required="" lay-verType="tips" lay-verify="identity|number" placeholder="请输入身份证" autocomplete="off" class="layui-input" readonly="readonly"/></td>
				</tr>
				<tr>
					<td>手机号码：</td>
					<td> <input type="text" name="phone"  lay-verType="tips" lay-verify="phone" placeholder="请输入手机号" autocomplete="off" class="layui-input" readonly="readonly"/></td>
				</tr>
				<tr>
					<td>金额：</td>
					<td><input type="text" name="money" lay-verType="tips" lay-verify="number" placeholder="请输入金额" autocomplete="off" class="layui-input" readonly="readonly"/></td>
				</tr>
				<tr>
					<td>身份证正面：</td>
					<td>
						<div class="layui-upload zheng">
							<button type="button" class="layui-btn" id="id_just">上传身份证正面</button>
							<div class="layui-upload-list">
								<img class="layui-upload-img" id="demo1" width="350px" height="227px" src="${webroot}/static/plugins/user/images/sfz1.png">
								<p id="demoText1"></p>
							</div>
						</div>
						<div class="layui-upload zheng" id="clear" style="clear: both;">
							<button type="button" class="layui-btn" id="id_against">上传身份证反面</button>
							<div class="layui-upload-list">
								<img class="layui-upload-img" id="demo2" width="350px" height="227px" src="${webroot}/static/plugins/user/images/sfz2.png">
								<p id="demoText2"></p>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td>地址：</td>
					<td>
						<div data-toggle="distpicker" id="target">
							<select name = "province" class="layui-input-inline" id="province"
							<#if province != ''>data-province="${province}"</#if>></select>
							<select name="city" class="layui-input-inline" id="city"
							<#if city != ''>data-city="${city}"</#if>
							></select>
							<select name="area" class="layui-input-inline" id="area"
							<#if area != ''>data-district="${area}"</#if>
							></select>
						</div>
					</td>
				</tr>
				<tr>
					<td>详细地址：</td>
					<td><textarea placeholder="请输入详细地址，如：街道、小区、楼栋" id="address"></textarea></td>
				</tr>
				<tr>
					<td></td>
					<td><input type="submit" value="提交" class="xu_show"></td>
				</tr>
			</table>
		</div>

		<!--提交弹窗-->
		<div class="popup_box popup_xu">
			<div class="popup">
				<div class="popup_title">
					<h2>信息提交</h2>
					<i class="popup_hide"></i>
				</div>
				<div class="shi">
					<h2>是否确认提交？</h2>
					<div class="popup_btn">
						<input type="button" id="ok" value="确定" />
						<input type="button" id="no" value="取消" />
					</div>
				</div>
			</div>
		</div>

	<script>
		$(".xu_show").click(function(){
			$(".popup_xu").css("display","block");
		});
		$(".popup_hide").click(function(){
			$(".popup_box").css("display","none");
		});
	</script>
	<script>
        layui.use(['upload','layer','jquery','form'], function() {
            var upload = layui.upload,
				layer = layui.layer,
				form = layui.form,
                $ = layui.$;
             //身份证正面上传
            var just =   upload.render({
                 elem: '#id_just'
                ,url: 'just.json'
				,accept: 'images'
				,acceptMime: 'image/jpg, image/png, image/jpeg'
				,exts: 'jpg|png|jpeg'  //允许上传文件的后缀  指定上传文件格式
				,size: 3072       //允许上传文件的大小  3m
				,drag: true
                ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
//                        fileName[0] = file.name;
                        $('#demo1').attr('src', result); //图片链接（base64）
                        $('#demo1').attr('alt', file.name); //图片名字
                    });
                }
                ,done: function(res){
					if (res.code = 200){
					    layer.msg("成功!");
					} else {
                        var demoText = $('#demoText1');
                        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                        demoText.find('.demo-reload').on('click', function(){
                            just.upload();
                        });
					}
                }
                ,error: function(){
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText1');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function(){
                        just.upload();
                    });
                }
            });
			 //身份证反面上传
            var against = upload.render({
                elem: '#id_against'
                ,url: 'against.json'
                 ,accept: 'images'
                 ,acceptMime: 'image/jpg, image/png, image/jpeg'  //layer版本太低 无法显示
                 ,exts: 'jpg|png|jpeg'  //允许上传文件的后缀  指定上传文件格式
                 ,size: 3072       //允许上传文件的大小  3m
                 ,drag: true
                 ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        $('	#demo2').attr('src', result); //图片链接（base64）
                        $('#demo2').attr('alt', file.name); //图片名字
                    });
                }
                ,done: function(res){
                     if (res.code = 200){
                         layer.msg("成功!");
                     } else {
                         var demoText = $('#demoText1');
                         demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                         demoText.find('.demo-reload').on('click', function(){
                             against.upload();
                         });
                     }
                }
                ,error: function(){
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText2');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function(){
                        against.upload();
                    });
                }
            });

            $(function () {
                /**
				 * 打开重要提示窗口
                 */
				$.ajax({
                      url: 'read.json',
                      type: 'post',
                      data: '',
                      dataType: 'json'
                      ,success: function (data) {
                          var result = "";
                           if (data.length > 0) {
                                result += data;
                            }
                         //示范一个公告层
                         layer.open({
                             type: 1
                             ,title: '重要信息' //不显示标题栏
                             ,closeBtn: false
                             ,area:  '500px'
                             ,shade: 0.8
                             ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                             ,resize: false
                             ,btn: ['我已阅读重要提示']
                             ,btnAlign: 'c'
                             ,moveType: 1 //拖拽模式，0或者1
                             ,content: '<div style="padding: 50px; line-height: 22px; background-color: #fff; color: #020202; font-weight: 300; font-size: 18px ">'
                             + result +'</div>'
                             ,success: function(){
                                 $.ajax({
                                     url: 'init.json',
                                     type: 'post',
                                     data: '',
                                     dataType: 'json',
                                     success: function (data) {
                                         $("input[name=user_id]").val(data.user_id);
                                         $("input[name=user_name]").val(data.user_name);
                                         $("input[name=id_card]").val(data.id_card);
                                         $("input[name=phone]").val(data.phone);
                                         $("input[name=money]").val(data.money);
                                         var id_justImg = data.id_just;
                                         var id_againstImg = data.id_against;
                                         var province = data.province;
                                         var city = data.city;
                                         var area = data.area;
                                         var address = data.address;
                                         if (id_justImg != "" && id_justImg != null && id_againstImg != null && id_againstImg != ""){
                                             $('#demo1').attr('src', "/ofcms-admin/upload/id/"+id_justImg); 		//图片链接（base64）
                                             $('#demo1').attr('alt', id_justImg); 								//图片alt
                                             $('#demo2').attr('src', "/ofcms-admin/upload/id/"+id_againstImg);	 //图片链接（base64）
                                             $('#demo2').attr('alt', id_againstImg); 								//图片alt
                                         }
                                         if (province != "" && city != "" && area != ""){
                                             $('#target').distpicker('destroy');
                                             $('#target').distpicker({
                                                 province: province,
                                                 city: city,
                                                 district: area
                                             });
                                         }

                                         if (address != "" && address != ""){
                                             $("#address").val(address)
                                         }
                                     }
                                     ,error: function (data) {
                                         layer.msg("对不起发生未知异常!请刷新页面重试！")
                                     }
                                 })
                             }
                             ,cancel: function(){
                                 //右上角关闭回调
                                 return false;  //开启该代码可禁止点击该按钮关闭
                             }
                         });


                     }
                        ,error: function (data) {
                            layer.msg("服务器发生异常!,请刷新页面重试!");
                        }

                    });
                $("#ok").click(function(){
                    $(".popup_box").css("display","none");
                    var user_name = $("input[name=user_name]").val();
                    var user_id = $("input[name=user_id]").val();
                    var id_card = $("input[name=id_card]").val();
                    var phone = $("input[name=phone]").val();
                    var money =  $("input[name=money]").val();
                    var province =  $("#province").val();
                    var city =  $("#city").val();
                    var area =  $("#area").val();
                    var address =  $("#address").val();
                    var province_data =  provinceCode();
                    var city_data =  cityCode();
                    var area_data =  areaCode();
                    var id_just = $("#demo1").attr("alt");
                    var id_against =$("#demo2").attr("alt");
                    var flag = true;
                    if (province == ""){
                        flag = false;
                        layer.msg("请选择省!")
                    } else if (city == ""){
                        flag = false;
                        layer.msg("请选择市");
                    } else if (area == ""){
                        flag = false;
                        layer.msg("请选择县!");
                    } else if(address == "") {
                        flag = false;
                        layer.msg("请输入地址!");
                    }
                    if (flag){
                        $.ajax({
                            url: 'save.json',
                            type: 'post',
                            data: {id_card:id_card,phone:phone,address:address,id_just:id_just,id_against:id_against, province:province
                                ,city:city,area:area,province_data:province_data,city_data:city_data,area_data:area_data,user_id:user_id},
                            dataType: 'json',
                            success: function (data) {
                                if (data = "成功!"){
                                    layer.msg("录入成功!");
                                }else {
                                    layer.msg("对不起，录入失败!请刷新页面重试！")
                                }
                            }
                            ,error: function (data) {
                                layer.msg("对不起，录入失败!请刷新页面重试！")
                            }
                        })
                    }

                });
                $("#no").click(function(){
                    $(".popup_box").css("display","none");
                });
                function provinceCode(){
                    var firstCode= $('#province').find('option:selected').attr('data-code');  //获取被选中的option的属性值
                    return firstCode;	//返回最终获取的code码
                };
                function cityCode(){
                    var secondCode = $('#city').find('option:selected').attr('data-code');  //获取被选中的option的属性值
                    return secondCode;	//返回最终获取的code码
                };
                function areaCode(){
                    var thirdCode= $('#area').find('option:selected').attr('data-code');
                    return thirdCode;	//返回最终获取的code码
                };
                })
            })
	</script>



<script type="text/javascript" src="${webroot}/static/plugins/user/plugins/vue/vue.min.js" ></script>
<script type="text/javascript" src="${webroot}/static/plugins/user/plugins/eleme-ui/index.js" ></script>
<script type="text/javascript" src="${webroot}/static/plugins/user/plugins/city-picker/city-data.js" ></script>
<script type="text/javascript" src="${webroot}/static/plugins/user/js/CivilMilitaryIntegration/ShoppingCart.js" ></script>
</body>
</html>
